<!DOCTYPE html>
<html lang="en">
<head>
    <title>DOOM Captcha - Captchas don't have to be boring</title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="shortcut icon" href="favicon.ico"/>

    <meta property="og:image" content="https://vivirenremoto.github.io/doomcaptcha/static/social.jpg">
    <meta property="og:image:secure_url" content="https://vivirenremoto.github.io/doomcaptcha/static/social.jpg">
    <meta property="og:image:alt" content="DOOM Captcha">
    <meta property="og:image:type" content="image/png">
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="DOOM Captcha">
    <meta name="twitter:image" content="https://vivirenremoto.github.io/doomcaptcha/static/social.jpg">
</head>
<body>

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-L7DMC1G74Q"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-L7DMC1G74Q');
</script>

<style>
body{font-family:arial;padding:20px;padding-bottom:80px;}
h1{color:red;border-bottom:1px red solid;padding-bottom:5px;margin-bottom:40px;}
a{color:blue;}

#btn_feedback{font-size:17px;display:none;background:#EA532A;text-decoration:none;color:white;padding:15px 0;position:fixed;text-align:center;right:0;bottom:0;width:100%;}

textarea{color:blue;border:1px blue solid;width:900px;max-width:90%;}

#credits_box{border:5px solid #fff1bd;border-left:0;border-right:0;background:#FFFCF1;padding:20px;}
#credits_box h2{margin-top:0;}

#btn_ph{position:fixed;right:10px;top:10px;}
</style>

<a id="btn_feedback" href="https://forms.gle/h7REigxfxNNx7tEx5" target="_blank">🎈 Are you interested in more games?</a>

<br><br>

<h1>😈 Doom Captcha</h1>

<div id="btn_ph">
    <a href="https://www.producthunt.com/posts/doom-captcha?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-doom-captcha" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=296952&theme=dark" alt="DOOM Captcha - Captchas don't have to be boring | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
</div>

<h2>💻 Demo</h2>

<form action="success.html">
    <p>
        Your Email<br>
        <input name="email">
    </p>

    <script src="script.js?version=17" countdown="on" label="Captcha" enemies="4"></script>

    <p>
        <button>Unsubscribe</button> &nbsp; <button onClick="window.location.reload();">Restart</button>
    </p>
</form>

<br>

Disclaimer: Don't take this too seriously, this is a little project for fun, if do you know how to code it's pretty easy to break the security of this.

<br><br><br>
<hr>
<br>

<h2>👨‍💻 Code</h2>

<pre>
&lt;form action="success.html"&gt;
    &lt;p&gt;
        Your Email&lt;br&gt;
        &lt;input name="email"&gt;
    &lt;/p&gt;

    <textarea readonly onclick="this.select()" rows="5"><script src="script.js?version=16" countdown="on" label="Captcha" enemies="4"></script></textarea>

    &lt;p&gt;
        &lt;button&gt;Unsubscribe&lt;/button&gt;
    &lt;/p&gt;
&lt;/form&gt;
</pre>

<br>

<b>Parameters</b>

<br>

<ul>
    <li>countdown: on / off</li>
    <li>label: Text before captcha, you can leave it empty</li>
    <li>enemies: Total enemies to kill to complete the captcha, by default 4</li>
    <li>Last update - 30/05/2021</li>
</ul>
<br>

<b>Cheat codes - Easter eggs</b>
<br><br>
Only works on desktop mode if you click start and write:
<br>
<ul>
    <li>iddqd: Complete the captcha.</li>
    <li>idkfa: Unlock the super shotgun.</li>
</ul>
<br>

<b>Source code</b>
<br><br>
The code repository is available on <a href="https://github.com/vivirenremoto/doomcaptcha" target="_blank">GitHub</a>, feel free to contribute with pull requests or fork the project for your own.

<br><br><br>
<hr>

<br>


<h2>🤘 You rock!</h2>

Thanks for your contributions:

<ul>
    <li><a href="https://github.com/Wittev1/" target="_blank">Jelle Witteveen</a>: JS optimization</li>
    <li><a href="https://github.com/itsthesteve/" target="_blank">Steve</a>: Fix typos</li>
    <li><a href="https://github.com/Saibamen/" target="_blank">Adam Stachowicz</a>: Code formatting & image optimization.</li>
    <li><a href="https://github.com/leereilly/" target="_blank">Lee Reilly</a>: Fix typos</li>
    <li><a href="https://github.com/makc/" target="_blank">makc</a>: Original Doom game backgrounds</li>
    <li><a href="https://github.com/jaapbrasser/" target="_blank">Jaap Brasser</a>: idkfa super shotgun cheat code</li> 
</ul>
<br>
<hr>

<br>

<h2>🥳 We did it!</h2>

DOOM Captcha become TOP 1 Product of the Day on Product Hunt, thank you!
<br><br>

<a href="https://www.producthunt.com/posts/doom-captcha?utm_source=badge-top-post-badge&utm_medium=badge&utm_souce=badge-doom-captcha" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/top-post-badge.svg?post_id=296952&theme=light&period=daily" alt="DOOM Captcha - Captchas don't have to be boring | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>

<br><br>

This is Crazy! I had the idea this Friday, developed the first version on Saturday morning, published that night and went live here on Sunday.
<br><br>
I think that today there have been much better projects than this one, but somehow <b>DOOM Captcha</b> has brought you some kind of nostalgia and you felt the project as yours.
<br><br>
I'd like to continue my career as a creative developer, so you all gave me a little more confidence in me, if you loved this I'd like you to check out <a href="https://vivirenremoto.github.io/" target="_blank">my projects</a> as well.

<br><br>
Thank you all for your welcome and comments, I hope you enjoyed it, had a few laughs and it made you want to play DOOM again.

<br><br>

❤️ Update 2021-05-26: John Carmack (Doom creator) liked it.



<br><br><br><br>

<div id="credits_box">
<h2>🙋‍♂️ Hello</h2>

My name is <a href="https://vivirenremoto.github.io/doomcv/en.html" target="_blank">Miquel Camps Orteza</a> and you can follow me on <a href="https://twitter.com/vivirenremoto" target="_blank">Twitter</a>

<br><br>

Do you like this? I made the worst captcha ever <a href="https://www.producthunt.com/posts/squat-captcha" target="_blank">Squat Captcha</a>, also you can check out <a href="https://vivirenremoto.github.io/" target="_blank">my side projects</a>

<br><br>

🟢 <a href="http://bit.ly/miquel_linkedin" target="_blank" style="font-weight:bold;color:#000">I'm available for work</a>

<br><br>

☕ <a href="https://www.buymeacoffee.com/vivirenremoto" target="_blank" style="font-weight:bold;color:#000">Buy me a coffee</a>

</div>

<br><br>

<script>
setTimeout(function() {
    document.getElementById('btn_feedback').style.display = 'block';
}, 7000);
</script>

</body>
</html>
